<template>
  <el-select v-bind="$attrs" autoComplete="new-password" :value="value" v-on="$listeners">
    <el-option
      v-for="item in innerOptions"
      :key="item[innerProps.value]"
      :disabled="item[innerProps.disabled]"
      :label="item[innerProps.label]"
      :value="item[innerProps.value]"
    ></el-option>
  </el-select>
</template>

<script>
import { isPlainObject } from '@/common/plugins/tools/type'
import { toOptions } from './tags'

export default {
  name: 'CSelect',
  props: {
    value: {
      default: '',
    },
    props: Object,
    numberKey: Boolean,
  },
  computed: {
    innerProps() {
      return Object.assign(
        {
          value: 'value',
          label: 'label',
          disabled: 'disabled',
        },
        this.props
      )
    },
    innerOptions() {
      const { options } = this.$attrs
      return isPlainObject(options) ? toOptions(options, this.numberKey) : options || []
    },
  },
}
</script>
